if (!sessionStorage.getItem("user")) {
	sessionStorage.setItem("backUrl", window.location.href);
	layer.alert("还没登陆呢我的祖宗唷", {
		closeBtn: 0
	}, () => {
		window.location.href = "../login/login.html";
	});
} else {
	var user = sessionStorage.getItem("user");

	$('ul.list').html(
		cart.filter(item => item.user === user)
		.map(item => {
			var target = product.find(item2 => item2.id === item.pid)
			return `
					<li>
						<i class="checkbox normal checked show"></i>
						<i class="checkbox edit"></i>
						<img src="${target.avatar}">
						<div class="detail">
							<h3>${target.name}</h3>
							<p>${target.remark}</p>
							<div class="count-wrapper">
								<button class="btn-decrease">-</button>
								<span class="count">${item.count}</span>
								<button class="btn-increase">+</button>
							</div>
							￥<span class="price">${target.price}</span>.00
						</div>
					</li>
				`;
		})
		.join("")
	);
	
	$('button.btn-decrease').on('click', function() {
		$(this).next().next().attr('disabled', false);
		var newCount = parseInt($(this).next().text()) - 1;
		$(this).next().text(newCount);
		// 检查是否符合范围，不符合禁用按钮
		// $(this).attr('disabled', newCount === 1);
		if (newCount <= 1) {
			$(this).attr('disabled', true);
			$(this).toggleClass("limited");
		} else {
			$(this).next().next().removeClass('limited');
		}
		updateTotal();
	});
	$('button.btn-increase').on('click', function() {
		$(this).prev().prev().attr('disabled', false);
		var newCount = parseInt($(this).prev().text()) + 1;
		$(this).prev().text(newCount);
		// 检查是否符合范围，不符合禁用按钮
		if (newCount >= 10) {
			$(this).attr('disabled', true);
			$(this).toggleClass("limited");
		} else {
			$(this).prev().prev().removeClass('limited');
		}
		// $(this).attr('disabled', newCount === 10);
		updateTotal();
	});
	updateTotal();
}


//给右上角的按钮绑定点击事件
$('button.btn-begin-edit, button.btn-end-edit').on('click', () => {
	$('button.btn-begin-edit, button.btn-end-edit')
		.add('ul.list i.checkbox')
		.add('.footer-normal, .footer-edit')
		.toggleClass("show");
	$(this).toggleClass('checked');
	$('i.checkbox.all.normal').toggleClass(
		"checked",
		$('ul.list i.checkbox.normal:not(.checked)').length === 0
	);
	updateTotal();
});

// //全选反联动
//写成入表达式则this不能使用，要使用this使用匿名函数
$('i.checkbox.all.normal').on('click', function() {
	$(this).toggleClass('checked');
	$('ul.list i.checkbox.normal').toggleClass("checked", $(this).hasClass("checked"));
	updateTotal();
});

$('i.checkbox.all.edit').on('click', function() {
	$(this).toggleClass('checked');
	$('ul.list i.checkbox.edit').toggleClass("checked", $(this).hasClass("checked"));
	updateTotal();
});


//上联动下
$('ul.list i.checkbox.normal').on('click', function() {
	$(this).toggleClass('checked');
	$('i.checkbox.all.normal').toggleClass(
		"checked",
		$('ul.list i.checkbox.normal:not(.checked)').length === 0
	);
	updateTotal();
});

$('ul.list i.checkbox.edit').on('click', function() {
	$(this).toggleClass('checked');
	$('i.checkbox.all.edit').toggleClass(
		"checked",
		$('ul.list i.checkbox.edit:not(.checked)').length === 0
	);
	updateTotal();
});


//公共函数，用于更新显示总金额
function updateTotal() {
	var total = 0;
	$('ul.list li:has(i.checkbox.normal.checked)').each(function(i, item) {
		var price = parseInt($(item).find('span.price').text());
		var count = parseInt($(item).find('span.count').text());
		total += price * count;
	});
	$('span.total').text(total);
}

//删除购物记录
$('button.btn-remove').on('click', function() {
	var $checkboxes = $('ul.list i.checkbox.edit.checked');
	if ($checkboxes.length === 0) {
		layer.alert('请至少选择一条购物记录');
		return;
	}
	layer.confirm('不剁手了？', {
		closeBtn: 0
	}, () => {
		layer.closeAll('dialog');
		$checkboxes.each(function(i, checkbox) {
			$(checkbox).closest('li').remove();
		});
		//判断购物车是否还有东西
		if ($('ul.list li').length === 0) {
			$('button.btn-begin-edit, button.btn-end-edit')
				.add('.footer-normal, .footer-edit')
				.removeClass('show');
			$('ul.list').replaceWith(
				'<a class="cartEmpty"><div>空空如也</div><div>(っ °Д °;)っ</div></a>'
			);
		}
	});
});
